<template>
	<nav-header title="企业">
		<view class="mb-4 p-4 bg-white">
			<view class="pl-2 pb-4 border-b-ee flex items-center">
				<image :src="$util.formatImageIdUrl(companyObj.logo)" class="w-16 h-16"></image>
				<view class="flex-1 pl-4">
					<view class="text-lg text-black-32 font-bold" v-text="companyObj.name"></view>
					<view class="mt-2 text-gray-99 text-sm">
						 <text v-if="" class="pr-2" v-text="getTagStr(companyObj.tagList)"></text>
						<u-read-more color="#2d58cb" closeText="展开" toggle showHeight="110">
							<rich-text :nodes="companyObj.businessScope || ''"></rich-text>
						</u-read-more>
					</view>
				</view>
			</view>
			<view class="pt-4 pb-2">
				<view class="text-black-32 font-bold mb-4">公司介绍</view>
<!--				 <u-read-more color="#2d58cb" closeText="展开" toggle showHeight="110">-->
					<u-parse :content="companyObj.content"></u-parse>
<!--				 </u-read-more>-->
			</view>
		</view>
		<view v-if="productList.length > 0" class="bg-white mb-4 px-4">
			<view class="py-4 border-b-ee flex items-center justify-between">
				<view class="text-black-32 font-bold">公司设备</view>
				<view class="text-gray-66 text-sm" @click="$util.myNavigateTo('/pages_home/lianmeng/product_index?current=1&companyId=' + id)">查看更多</view>
			</view>
			<view class="grid grid-cols-3 gap-4 py-6">
				<view v-for="item in productList" :key="item.id" class="text-center" @click="$util.myNavigateTo('/pages_home/lianmeng/product_detail?id=' + item.id)">
					<image :src="$util.formatImageIdUrl(item.cover)" class="w-16 h-16"></image>
					<view class="mt-2 text-sm text-color-theme" v-text="item.name"></view>
				</view>
			</view>
			<view v-if="productList.length == 0" class="w-full h-40 pb-4 flex items-center justify-center">
				<empty-data :width="emptyWidth" :height="emptyWidth"></empty-data>
			</view>
		</view>
		<view v-if="projectList.length > 0" class="bg-white mb-4 px-4">
			<view class="py-4 border-b-ee flex items-center justify-between">
				<view class="text-black-32 font-bold">公司平台</view>
				<view class="text-gray-66 text-sm" @click="$util.myNavigateTo('/pages_home/lianmeng/project_index?current=2&companyId=' + id)">查看更多</view>
			</view>
			<view>
				<view v-for="(item,index) in projectList" :key="item.id" class="py-4" :class="{'border-b-ee': index != projectList.length - 1}" @click="$util.myNavigateTo('/pages_home/lianmeng/project_detail?id=' + item.id)">
					<view class="text-black-32 font-bold" v-text="item.name"></view>
					<view class="mt-2 text-gray-66 text-sm zx-multi-ellipsis--3" v-text="item.introduce || ''"></view>
				</view>
			</view>
			<view v-if="projectList.length == 0" class="w-full h-40 pb-4 flex items-center justify-center">
				<empty-data :index="1" :width="emptyWidth" :height="emptyWidth"></empty-data>
			</view>
		</view>
		<view v-if="companyObj.images" class="bg-white mb-4 px-4 pb-4">
			<view class="pt-4 pb-6 text-black-32 font-bold">公司相册</view>
			<u-swiper :list="companyObj.imageList" height="180" indicator indicatorMode="dot"
				 radius="8" bgColor="#ffffff">
			</u-swiper>
		</view>
		<view class="bg-white mb-4 px-4 pb-6">
			<view class="pt-4 pb-6 text-black-32 font-bold">联系我们</view>
			<view class="pl-2">
				<view class="flex items-center mb-3">
					<i class="iconfont icon-yonghu text-color-theme text-lg"></i>
					<text class="text-gray-66 pl-2" v-text="companyObj.leaderName || '暂无'"></text>
				</view>
				<view class="flex items-center justify-between mb-3">
					<view class="flex items-center">
						<i class="iconfont icon-dianhua text-color-theme text-lg"></i>
						<text class="text-gray-66 pl-2" v-text="companyObj.leaderPhone || '暂无'"></text>
					</view>
					<view class="rounded-full px-3 py-1 text-gray-66 text-sm" style="border: 1px solid #b1afaf;" @click="phoneCall()">
						拨打
					</view>
				</view>
				<view class="flex items-center justify-between mb-3">
					<view class="flex items-center flex-1 mr-2">
						<i class="iconfont icon-zuobiaofill text-color-theme text-lg"></i>
						<text class="text-gray-66 pl-2" v-text="companyObj.address"></text>
					</view>
				</view>
			</view>
		</view>
    <view class="bg-white mb-4 p-4 pb-6">
      <view class="bg-white w-full py-4 fixed bottom-0 z-50 shadow-lg">
        <view class="flex items-center mx-5">
          <view class="text-center mr-8">
            <i class="iconfont icon-fenxiang block text-xl text-color-a0"></i>
            <text class="text-gray-99 text-sm">分享</text>
          </view>
          <view  class="flex items-center justify-center flex-1 py-2_5 rounded-full text-white mx-1 bg-green-900"
                 @click="phoneCall">电话联系</view>
          <view  class="flex items-center justify-center flex-1 py-2_5 rounded-full text-white mx-1 bg-theme  "
                 @click="$util.myNavigateTo('/pages_mine/edit_user?businessType=companyApply&businessId='+companyObj.id+'&businessName='+companyObj.name)">在线提单</view>
        </view>
      </view>
    </view>
	</nav-header>
</template>

<script>
	import {mapState} from 'vuex'
	import NavHeader from '@/components/nav_header.vue'
	import EmptyData from '@/components/empty_data.vue'
	import * as unionApi from '@/interface/junchuang/union.js'
	export default {
		components: {
			NavHeader,EmptyData
		},
		data() {
			return {
				id: '',
				formCode: '',
				platform: '',
				currentNum: 0,
				emptyWidth: 135,
				productList: [],
				projectList: [],
				isBottom: false,
				no_occlusion: false,
				pageScrollHeight: 0,
				companyObj: this.initObj({}),
				typeArr: ['普通','培训机构', '法律机构', '公证处', '拥军企业']
			}
		},
		onLoad(e) {
			const v = this
			v.id = e.id
			wx.getSystemInfo({
				success: function(res) {
					v.platform = res.platform
				}
			})
		},
		onPageScroll({scrollTop}) {
			if (this.isBottom) {
				this.isBottom = false
				this.pageScrollHeight = scrollTop
			}
			this.no_occlusion = this.pageScrollHeight && (this.pageScrollHeight - 10 <= scrollTop)
		},
		onReachBottom () {
			this.isBottom = true
		},
		computed: {
			...mapState({
				user: state => state.user
			})
		},
		onShow() {
      this.$util.openShare();
			const v = this
			v.initData()
			if (v.user.token) v.formCode = v.$util.getFormCode('法律咨询')
			unionApi.getCompanyDetail(v.id).then(res=>{
				if (res.success) {
					const {images} = res.data
					let imageList = []
					if (images) {
						images.split(",").forEach(imgId => {
							imageList.push(v.$util.formatImageIdUrl(imgId))
						})
					}
					Object.assign(v.companyObj,res.data, {
						imageList: imageList
					})
				}
			})
		},
		methods: {
			initData() {
				let data = {
					pageNum: 1,
					pageSize: 3,
					companyId: this.id
				}
				unionApi.getCompanyProductPageList(data).then(res=>{
					if (res.success) {
						this.productList = res.data.rows
					}
				})
				unionApi.getCompanyProjectPageList(data).then(res=>{
					if (res.success) {
						this.projectList = res.data.rows
					}
				})
			},
			goNav () {
				if (!this.companyObj.latitude) return
				wx.openLocation({
					latitude: parseFloat(this.companyObj.latitude),
					longitude: parseFloat(this.companyObj.longitude)
				})
			},
			phoneCall () {
				const v = this
				if (!v.companyObj.leaderPhone) return
				if (v.platform == 'ios') {
					call()
				}else {
					wx.showActionSheet({
						itemList: [v.companyObj.leaderPhone,'呼叫'],
						success:function(res){
							if(res.tapIndex==1){
								call()
							}
						}
					})
				}
				function call() {
					wx.makePhoneCall({
						phoneNumber: v.companyObj.leaderPhone
					})
				}
			},
			initObj ({id,name,latitude,longitude,leaderName,imageList = [], leaderPhone, content, images, logo, address, type, memberNum, businessScope,tagList}) {
				return {id,name,latitude,longitude,leaderName, imageList, leaderPhone, content, images, logo, address, type, memberNum, businessScope,tagList}
			},
      getTagStr(str){
        return str ? str.replace(/\;/g, '') : '';
      },
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #f7f7f7;
	}

	/deep/ .u-read-more__toggle {
		justify-content: flex-end !important;
	}
</style>
